<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>Insert title here</title>
		<link rel="stylesheet" href="./layui/css/layui.css">
		<script src="./layui/layui.js"></script>
		<script type="text/javascript" src="js/global.js"></script>
	</head>

	<body>
		<div class="layui-form-item" style="margin-top: 20px" onsubmit="false">
			<div class="layui-form-item">
				<label class="layui-form-label">学生姓名</label>
				<div class="layui-input-inline">
					<input class="layui-input" name="stuName" id="stuName" lay-verify="required" />
				</div>
				<label class="layui-form-label">咨询师姓名</label>
				<div class="layui-input-inline">
					<input class="layui-input" name="askerName" id="askerName" lay-verify="required" />
				</div>
				<label class="layui-form-label">跟踪类型</label>
				<div class="layui-input-inline">
					<select class="layui-input" id="followTRype" lay-verify="required">
						<option value="">---请选择---</option>
						<option value="家访">家访</option>
						<option value="线上">线上</option>
					</select>
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">是否回访</label>
				<div class="layui-input-inline">
					<select class="layui-input" id="isReturnVist" lay-verify="required">
						<option value="">---请选择---</option>
						<option value="是">是</option>
						<option value="否">否</option>
					</select>
				</div>
				<label class="layui-form-label">跟踪时间</label>
				<div class="layui-input-inline">
					<input class="layui-input" name="beginfollowTime" id="beginfollowTime" lay-verify="required" />
				</div>
				<label class="layui-form-label" style="width: 1px;">~</label>
				<div class="layui-input-inline">
					<input class="layui-input" name="endfollowTime" id="endfollowTime" lay-verify="required" />
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">创建时间</label>
				<div class="layui-input-inline">
					<input class="layui-input" name="begincreateTime" id="begincreateTime" lay-verify="required" />
				</div>
				<label class="layui-form-label" style="width: 1px;">~</label>
				<div class="layui-input-inline">
					<input class="layui-input" name="endcreateTime" id="endcreateTime" lay-verify="required" />
				</div>
				<button class="layui-btn" id="serach" data-type="reload">搜索</button>
			</div>
		</div>
		<table id="demo" lay-filter="test"></table>
		<script type="text/html" id="barDemo">
			<!--<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>-->
			<a class="layui-btn layui-btn-xs" lay-event="follow">跟踪日志</a>
			<!--<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>-->
		</script>
		<script type="text/html" id="toolbarDemo">
			<div class="layui-btn-container">
				<button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
			</div>
		</script>
		<script>
			layui.use(['table', 'form', 'laydate'], function() {
				var table = layui.table;
				var $ = layui.jquery; //引入jquery
				var form = layui.form;
				var laydate = layui.laydate;
				//解决跨域
				$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
					options.xhrFields = {
						withCredentials: true
					}
				})
				//第一个实例
				table.render({
					elem: '#demo',
					toolbar: '#toolbarDemo' //开启头部栏工具
						,
					url: globalData.server + './netFollow/getAllNetFollow?loginName='+globalData.getUserName() //数据接口
						,
					page: true //开启分页
						,
					method: 'POST',
					id: 'idTest',
					cols: [
						[ //表头
							{
								field: 'id',
								title: 'ID',
								width: 80,
								sort: true,
								fixed: 'left',
								align: 'center'
							}, {
								field: 'stuName',
								title: '学生姓名',
								width: 120,
								align: 'center'
							}, {
								field: 'askerName',
								title: '咨询师姓名',
								width: 150,
								align: 'center'
							}, {
								field: 'isReturnVist',
								title: '是否回访',
								width: 100,
								align: 'center'
							}, {
								field: 'followTime',
								title: '跟踪时间',
								width: 180,
								align: 'center'
							}, {
								field: 'followTRype',
								title: '跟踪类型',
								width: 100,
								align: 'center'
							}, {
								field: 'createTime',
								title: '创建时间',
								width: 180,
								align: 'center'
							}, {
								field: 'followState',
								title: '跟踪状态',
								width: 100,
								align: 'center'
							}, {
								field: 'content',
								title: '跟踪内容',
								width: 120,
								align: 'center'
							}, {
								field: 'right',
								title: '操作',
								toolbar: '#barDemo',
								align: 'center',
								width: 150
							}
						]
					]
				});
				//双击显示详情
				table.on('rowDouble(test)',function(obj){
					layer.open({ //打开一个页面
							type: 2, //在当前页面之上以弹框的形式，展示编辑页面
							area: ['500px', '550px'], //页面宽高
							content: 'netfollows-check.html', //页面所在位置
							title: '您正在查看追踪信息编号为' + obj.data.id + '的信息',
							success: function(layero, index) {
								var body = layer.getChildFrame('body', index);
								body.contents().find("#stuName").val(obj.data.stuName);
								body.contents().find("#followTime").val(obj.data.followTime);
								body.contents().find("#nextFollowTime").val(obj.data.nextFollowTime);
								body.contents().find("#followTRype").val(obj.data.followTRype);
								body.contents().find("#followState").val(obj.data.followState);
								body.contents().find("#content").val(obj.data.content);
								body.contents().find("#createTime").val(obj.data.createTime);
								body.contents().find("#askerName").val(obj.data.askerName);
								body.contents().find("#age").val(obj.data.age);
								body.contents().find("#sex").val(obj.data.sex);
								body.contents().find("#phone").val(obj.data.phone);
								body.contents().find("#msgSource").val(obj.data.msgSource);
								body.contents().find("#sourceUrl").val(obj.data.sourceUrl);
								body.contents().find("#qq").val(obj.data.qq);
								body.contents().find("#weiXin").val(obj.data.weiXin);
							},
							end: function() {
								window.location.reload(); //当窗口关闭后刷新页面
							}
						});
				});
				$('#serach').on('click', function() {
					var stuName = $("#stuName").val(); //上面搜索框的id
					var askerName = $("#askerName").val(); //上面搜索框的id
					var followTRype = $("#followTRype").val(); //上面搜索框的id
					var isReturnVist = $("#isReturnVist").val(); //上面搜索框的id
					var beginfollowTime = $("#beginfollowTime").val(); //上面搜索框的id
					var endfollowTime = $("#endfollowTime").val(); //上面搜索框的id
					var begincreateTime = $("#begincreateTime").val(); //上面搜索框的id
					var endcreateTime = $("#endcreateTime").val(); //上面搜索框的id
					table.reload('idTest', {
						where: { //请求参数
							'stuName': stuName,
							'askerName': askerName,
							'followTRype': followTRype,
							'isReturnVist': isReturnVist,
							'beginfollowTime': beginfollowTime,
							'endfollowTime': endfollowTime,
							'begincreateTime': begincreateTime,
							'endcreateTime': endcreateTime,
						}
					});
				});

				//监听头部工具栏
				table.on('toolbar(test)', function(obj) {
					switch(obj.event) {
						case 'add':
							layer.open({ //打开一个页面
								type: 2, //在当前页面打开一个页面
								area: ['500px', '550px'], //页面宽高
								content: 'netfollows-add.html', //页面地址
								title: '新建追踪信息', //打开页面标题
								end: function() {
									window.location.reload(); //当窗口关闭后刷新页面
								}
							});
							break;
					};
				});
				//监听工具条
				table.on('tool(test)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
					var data = obj.data; //获得当前行数据
					/* if (obj.event === 'del') { //删除
						layer.confirm('真的删除行么', function(index) {
							var url = globalData.server+'./users/del';//请求地址
							$.post(url, {
								id : obj.data.id,
								loginName:globalData.getUserName(),
							}, function(data) {
								if (data.count > 0) {
									console.log('删除成功');
									window.location.reload();//刷新页面
								}else{
									layer.msg(data.msg, {
									icon: 6
								});
								}
							}, "json");
						});
					}else*/
					/*if (obj.event === 'edit') { //编辑
					layer.open({//打开一个页面
						type : 2,//在当前页面之上以弹框的形式，展示编辑页面
						area : [ '500px', '550px' ],//页面宽高
						content : 'user-edit.html',//页面所在位置
						title : '您正在编辑追踪信息编号为' + obj.data.id + '的信息',
						success : function(layero, index) {
							var body = layer.getChildFrame('body', index);
							body.contents().find("#id").val(obj.data.id);
							body.contents().find("#loginName").val(obj.data.loginName);
							body.contents().find("#protectEmail").val(obj.data.protectEmail);
							body.contents().find("#protectMtel").val(obj.data.protectMtel);
						},
						end : function() {
							window.location.reload();//当窗口关闭后刷新页面
						}
					});
				}else*/
					if(obj.event === 'follow') { //跟踪日志
						layer.open({ //打开一个页面
							type: 2, //在当前页面之上以弹框的形式，展示编辑页面
							area: ['500px', '550px'], //页面宽高
							content: 'netfollows-follow.html', //页面所在位置
							title: '您正在查看追踪信息编号为' + obj.data.id + '的跟踪日志',
							success: function(layero, index) {
								var body = layer.getChildFrame('body', index);
								body.contents().find("#id").val(obj.data.stuid);
							},
							end: function() {
								window.location.reload(); //当窗口关闭后刷新页面
							}
						});
					} 
				});
				//日期时间范围 创建开始时间
				laydate.render({
					elem: '#begincreateTime',
					type: 'datetime'
				});
				//日期时间范围 创建结束时间
				laydate.render({
					elem: '#endcreateTime',
					type: 'datetime'
				});
				//日期时间范围 上门开始时间
				laydate.render({
					elem: '#endfollowTime',
					type: 'datetime'
				});
				//日期时间范围 上门结束时间
				laydate.render({
					elem: '#beginfollowTime',
					type: 'datetime'
				});

			});
		</script>
	</body>

</html>